//- Copyright (c) 2016 Lucky Byte, Inc.
doctype html

html(lang="zh_CN")
  head
    meta(charset="utf-8")
    meta(http-equiv="Content-Type", content="text/html; charset=UTF-8")
    meta(http-equiv="X-UA-Compatible", content="IE=edge")
    meta(name="viewport", content="width=device-width, initial-scale=1.0")
    meta(name="description", content="不仅仅只是银联 POS 收单平台")
    meta(name="author", content="Lucky Byte, Inc.")
    meta(name="keyword", content="lucky byte,pay,payment.")

    title #{web_title} #{web_subtitle}

    link(rel="apple-touch-icon" href="/img/logo.png")

    link(href='/semantic/semantic.min.css', rel='stylesheet')
    link(href='/css/calendar.css', rel='stylesheet', type='text/css')
    link(href='/css/layout.css', rel='stylesheet')
    block css

    script(src="/js/jquery.min.js")
    script(src="/semantic/semantic.min.js")
    script(src="/js/js.cookie.js")
    script(src="/js/calendar.js")
    script(src="/js/tablesort.js")
    script(src="/js/lib.js")
    script(src="/js/layout.js")
    script(src="/js/form.js")
    block scripts

  body
    block page
      .ui.attached.borderless.menu.menubar
        .header.item(style="padding-top: 0px; padding-bottom: 2px;")
          img.logo(src="#{web_logo}")
          div(style="margin-left:15px; margin-right:20px; margin-top:4px;")
            h1.ui.header
              a(href="/" style="color:#{web_title_color};")= web_title
              if web_subtitle
                span.ui.sub.header(
                  style="color:#{web_subtitle_color}; margin-left:10px;")
                  = web_subtitle

        .right.menu
          a.browse.item.sysmenu
            i.unordered.list.icon.grey.fitted
            | 系统菜单
            i.dropdown.icon(style="margin-left:0px;")

          a.browse.item.notify
            - var notify_color = 'outline'
            if notify.error
              - notify_color = 'red'
            else if notify.warning
              - notify_color = 'orange'
            else if notify.notifications && notify.notifications.length > 0
              - notify_color = 'green'
            else if (notify.merchs_wait_check && notify.merchs_wait_check.length > 0)
              - notify_color = 'green'
            else if (notify.merchs_rejected && notify.merchs_rejected.length > 0)
              - notify_color = 'green'
            else if (notify.terms_wait_check && notify.terms_wait_check.length > 0)
              - notify_color = 'green'
            else if (notify.terms_rejected && notify.terms_rejected.length > 0)
              - notify_color = 'green'
            else if (notify.p1_wait_check && notify.p1_wait_check.length > 0)
              - notify_color = 'green'
            else if (notify.p2_wait_check && notify.p2_wait_check.length > 0)
              - notify_color = 'green'
            else if (notify.messages && notify.messages.length > 0)
              - notify_color = 'green'

            i.alarm.icon.fitted(class="#{notify_color}")
            | 站内通知
            i.dropdown.icon(style="margin-left:0px;")

          if hosts
            - var host_name = host ? host.name : null
            .ui.labeled.dropdown.item(style="#{host_name ? '' : 'color:red;'}")
              i.laptop.icon.grey.fitted
              | #{host_name ? host_name : '请配置'}
              i.dropdown.icon(style="margin-left: 5px;")
              .menu
                each host in hosts
                  a.item#host(href="#" data-serial="#{host.serial}"
                    data-uuid="#{host.uuid}")
                    span.text #{host.name}
                    span.description.left.floated(
                      style="font-size: small; margin-top: 4px;") #{host.ipaddr}
                  .divider(style="margin-top: 12px; margin-bottom:0px;")
                a.item(href="/hosts") 配置主机
          if userinfo
            .ui.dropdown.item
              i.user.icon.grey.fitted
              | #{userinfo.realname}
              i.dropdown.icon(style="margin-left: 5px;")
              .menu
                a.item(href="/userinfo")
                  i.user.icon
                  | 用户信息
                a.item(href="/logout")
                  i.sign.out.icon
                  | 退出登陆

      .ui.flowing.popup.transition.sysmenu.hidden
        .ui.grid.four.column
          each menu in sysmenu
            .column
              if menu.href
                .ui.header
                  a(href="#{menu.href}")= menu.header
              else
                .ui.header= menu.header
              .ui.link.list
                each item in menu.items
                  if (!item.noitem)
                    if (!item.disabled && (userinfo.role_root || item.permission.access))
                      a.item(href="#{item.href}" style="color:black;")
                        i.icon.angle.double.right.black
                        | #{item.title}
                    else
                      .item.disable
                        i.icon.ban.grey
                        | #{item.title}

      .ui.flowing.popup.transition.notify.hidden
        .ui.divided.relaxed.list
          include ./notify/list
      
      .ui.basic.attached.segment.navbar(
        style="padding:5px; padding-left:20px; padding-right:20px; margin-top:-1px;")
          .ui.grid
            .ui.six.wide.column
              .ui.small.breadcrumb#breadcrumb
                if host
                  .section
                    a(href="/hosts/edit/#{host.serial}")= host.name || ''
                else
                  .section(style="color:red;")= '未知主机'
                i.right.chevron.icon.divider
                
                if breadcrumbs
                  each breadcrumb, index in breadcrumbs
                    if breadcrumb.href && index < breadcrumbs.length - 1
                      .section
                        a(href="#{breadcrumb.href}") #{breadcrumb.title}
                    else
                      .section.active= breadcrumb.title
                    if index < breadcrumbs.length - 1
                      i.right.chevron.icon.divider
                  else
                    .section.active 空
                else
                  .section(style="color:red;") 无
            .ui.ten.wide.right.aligned.column
              .ui.small.breadcrumb#shortcut
                .section 快捷菜单
                i.right.chevron.icon.divider
                if shortcuts
                  each shortcut, index in shortcuts
                    .section
                      a(href="#{shortcut.href}") #{shortcut.title}
                    if index < shortcuts.length - 1
                      i.ellipsis.vertical.icon.divider
                  else
                    .section(style="color:red;") 无
                else
                  .section(style="color:red;") 无

      .ui.basic.attached.segment#content(
          style="padding:0px; padding-bottom:20px; margin-top:-1px;")
        input(type="hidden" name="page_perms" value="#{page_perms_str || ''}")
        block content

      .ui.very.basic.bottom.attached.segment(style="padding: 10px;")
        p(style="font-size: small; color: #bbb; text-align: right;")
          | &copy; 2015-2016 
          a(href="http://www.lucky-byte.com"
            style="color: #aaa;" target="blank") 诺百通讯
          i.ellipsis.vertical.icon.divider.small
          span(style="color: #aaa;") 版本 1.2.3
          i.ellipsis.vertical.icon.divider.small
          | 使用 
          a(href="https://www.mozilla.org/zh-CN/firefox/new/"
            style="color:#aaa; text-decoration:underline" target="blank") 火狐
          |  或 
          a(href="http://www.google.cn/intl/zh-CN/chrome/browser/desktop/index.html"
            style="color:#aaa; text-decoration:underline" target="blank") Chrome
          |  浏览器获得极速体验

  block code
